<!--
 * @Author: 许旺玉
 * @Description: 全局底部组件
 * @Date: 2020-06-22 15:18:27
 * @LastEditTime: 2020-07-08 10:26:30
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \靖凯商城\mobile_project\src\components\tarBar.vue
--> 

<template>
  <div class="tabBar">
    <van-tabbar route active-color="red">
      <van-tabbar-item replace to="/home" icon="wap-home-o">首页</van-tabbar-item>
      <van-tabbar-item replace to="/classification" icon="qr-invalid">分类</van-tabbar-item>
      <van-tabbar-item to="/shoppingcart" icon="cart-o" :badge="badge">购物车</van-tabbar-item>
      <van-tabbar-item replace to="/my" icon="contact">个人中心</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
import * as api from "@/api/apiList/cart/cart.js"; //购物车接口
export default {
  data() {
    return {
      badge: "0" //购物车初始化
    };
  },
  methods: {
    /**
     * @Author:郑宏杰
     * @description: 请求购物车得数量
     * @param {type}
     * @return: api.cart_count()
     */
    API_cartCount() {
      return api.cart_count();
    }
  },
  async activated() {
    // 执行请求购物车的数量方法
    let res = await this.API_cartCount();
    if (res.data.code === 200) {
      // console.log(res.data.data.total)
      this.badge = res.data.data.total;
    }
    
    this.$eventBus.$emit("badge",this.badge)
  }
};
</script>

<style lang="scss" scoped>
.tabBar{
  margin-top: 55px;
}
</style>